<%@ page language="java" import="java.util.*,com.opensymphony.xwork2.util.*,com.base.service.AddressService" 
pageEncoding="UTF-8" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ taglib prefix="json" uri="http://www.atg.com/taglibs/json" %>  

<!doctype html>
<html lang="zh-hans">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="lib/bootstrap/css/bootstrap.min.css">

<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/main.css">    
<script src="lib/jquery-2.1.1.min.js"></script>
<script src="lib/bootstrap/js/bootstrap.min.js"></script>
<title>HIFO-客户管理</title>
<!-- 省市区 -->
<script type="text/javascript">
<%
ValueStack vs=(ValueStack)request.getAttribute("struts.valueStack");
String myjson=(String)vs.findValue("cjsons");
%>
var client_json=<%=myjson%>

function tijiao(){
	//$("#opType").val(2);
	document.form1.submit();
};
</script>
</head>
<body>
<%@ include file="_daohang.jsp" %> 			 

<!-- 隐藏域 -->
<form name="form1"  action="kh_do" method="post"> 
<div class="form-group hide"> 
<div class="input-group">
<input type="text" class="form-control"  placeholder="openId" name="openId" id="openId" readonly="readonly" value="<s:property value="openId"/>">
<input type="text" class="form-control"  placeholder="state" name="state" id="state" value="<s:property value="state"/>">
<input type="text" class="form-control"  placeholder="cid" name="cid" id="cid" value="<s:property value="cid"/>">
<input type="text" class="form-control"  placeholder="total" name="total" id="total" value="<s:property value="total"/>">
<input type="text" class="form-control"  placeholder="tip"  id="tip" value="<s:property value="tip"/>">
<input type="text" class="form-control"  placeholder="queryType"  id="queryType" value="<s:property value="queryType"/>">
<input type="text" class="form-control"  placeholder="queryStr" name="queryStr" id="queryStr" value="<s:property value="queryStr"/>">

<input type="text" class="form-control"  placeholder="orderType" name="orderType" id="orderType" value="<s:property value="orderType"/>">
<input type="text" class="form-control"  placeholder="isDesc" name="isDesc" id="isDesc" value="<s:property value="isDesc"/>">
<input type="text" class="form-control"  placeholder="curPage" name="curPage" id="curPage" value="<s:property value="curPage"/>">
<input type="text" class="form-control"  placeholder="url" name="url" id="url" value="<s:property value="url"/>">

<!--  
<input type="button" class="btn btn-primary" value="确定提交"  onClick="tijiao()"  /> -->

</div><!-- input-group -->
</div><!-- form-group -->
</form>

<div class="container">

<!--搜索栏-->
<div class="row">
<div class="col-xs-12"><div class="mygray">格式：姓名/电话(默认为所有)</div></div>
</div>

<div class="input-group">
<div class="input-group-addon"><img class="home" src="images/add.png" onClick="deal(1)" ></div>
<input type="text" class="form-control" id="_input1" >
<div class="input-group-btn">
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">&equiv;<span class="caret"></span></button>
<ul class="dropdown-menu">
<li><a href="#">录入时间&bull;</a></li>
<li><a href="#">达成期限</a></li>
<li><a href="#">客户分类</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">降序&bull;</a></li>
<li><a href="#">升序</a></li>

</ul>
</div><!-- /btn-group -->

<div class="input-group-addon"><img class="home" src="images/search.png" onClick="deal(5)">
</div></div><!--input-group-addon  input-group-->

<div class="row">
<div class="col-xs-12"><div class="mygray"><s:property value="tip"/></div></div>
</div>


<!--内容列表 START-->
<div class="bs-example" data-example-id="simple-table">
<table class="table" id="client-table">
<thead>
<tr>
<th>姓名</th>
<th>区域</th>
<th>分类</th>
<th style="width:60px">期限</th>
</tr>
</thead>
<tbody>

<s:iterator value="clientList" status="st" id="c" > 
<tr onclick="a(this)">
<td><s:property value="#c.clientBase.name"/></td>
<td><s:property value='#c.clientBase.city'/>|<s:property value='#c.clientBase.area'/></td>
<td>
	<s:if test='#c.clientExtend.clientType=="b"'>
	&clubs;
	</s:if>
	<s:elseif test='#c.clientExtend.clientType=="c"'>
	&diams;
	</s:elseif>
	<s:elseif test='#c.clientExtend.clientType=="d"'>
	&hearts;
	</s:elseif>
	<s:elseif test='#c.clientExtend.clientType=="e"'>
	&spades;
	</s:elseif>
</td>
<td>

<!--进度条 百分比代表进度-->
<s:if test='#c.sellPlanRate>=0'>
<div class="progress jdt"> <div class="progress-bar" role="progressbar" 
aria-valuemin="0" aria-valuemax="100" style="width:<s:property value='#c.sellPlanRate'/>%;"></div></div>
</s:if>

</td>
</tr>

</s:iterator>

<!-- 
<tr>
<td>张学友</td>
<td>锦江区</td>
<td><img class="home" src="images/moon.png"></td>
<td>
<div class="progress jdt"> <div class="progress-bar" role="progressbar" 
aria-valuemin="0" aria-valuemax="100" style="width:25%;"></div></div>
</td>
</tr>  -->

</tbody>
</table>
</div><!-- /example 内容列表END -->

<!-- 底部工具条 -->
<!--分页-->
<ul class="pagination pull-right">


<li><a href="#">第<s:property value="curPage+1"/>页</a></li>

<s:if test="curPage>=50"><li><button type="button" class="btn btn-info" onClick="page(3)">-50页</button></li></s:if>
<s:if test="curPage>=0"><li><button type="button" class="btn btn-info" onClick="page(4)">+50页</button></li></s:if>

<s:if test="curPage>0"><li><button type="button" class="btn btn-info" onClick="page(1)">前一页</button></li></s:if>
<s:if test="curPage<totalPage"><li><button type="button" class="btn btn-info" onClick="page(2)">后一页</button></li></s:if>
<li><a href="#">共<s:property value="totalPage"/>页</a></li>

</ul>



</div><!-- container end  -->

<!-- ###################################################### -->
<!-- 按钮触发模态框  <button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">开始演示模态框</button> -->

<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" 
aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h5 class="modal-title" id="myModalLabel">客户详情</h5>
</div>
<div class="modal-body">
<!--此处可以加入很多信息 START-->   
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
  <div class="panel panel-default">
    <div class="panel-heading" role="tab" id="headingOne">
      <h5 class="panel-title">
        <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
          基本信息
        </a>
      </h5>
    </div>
    <div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
      <div class="panel-body khdetail" id="client-base">           
    
      </div>
    </div>
  </div>
  <div class="panel panel-default">
    <div class="panel-heading" role="tab" id="headingTwo">
      <h4 class="panel-title">
        <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
          扩展信息
        </a>
      </h4>
    </div>
    <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
      <div class="panel-body khdetail" id="client-extend">

      </div>
    </div>
  </div>
</div>          

<!--     
<a href="#" class="btn btn-danger">行动</a> 
<a href="#" class="btn btn-success">已阅</a>
<a href="#" class="btn btn-primary">修改</a> -->

<input type="button" class="btn btn-danger" value="行动"  onClick="deal(2)"  />
<input type="button" class="btn btn-success" value="已阅"  onClick="deal(3)"  />
<input type="button" class="btn btn-primary" value="修改"  onClick="deal(4)"  />

<!--此处可以加入很多信息 END-->     
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
<!--<a href="#" class="btn btn-primary">新增</a> -->

<!--<a href="#" class="btn btn-primary">作废</a>暂时不考虑作废功能，不管他就会自动作废 -->
<!--<button type="button" class="btn btn-primary">修改</button>-->
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<script>
//默认显示模态框
$(function () { 
//alert(client_json[0].clientBase.name);
//$('#myModal').modal('show');
});

// 获取点击的行数
function a(a){
i=a.rowIndex-1;
jcb=client_json[i].clientBase;
jce=client_json[i].clientExtend;
//alert(i);
//alert(client_json[i].clientBase);

$('#client-base').html(jcb);
$('#client-extend').html(jce);
$('#myModal').modal('show');
$('#cid').val(client_json[i].cid);
}

// 新增客户1 行动2 已阅3 修改4   查询5   事件 处理函数
function deal(type){
if(type==1)
	$('#state').val(1);
else if(type==2){
	form1.action="xd_do";  
	$('#state').val(5);
}
else if(type==3)
	$('#state').val(6);
else if(type==4)
	$('#state').val(3);
else if(type==5){
	$('#queryStr').val($('#_input1').val());
	$('#state').val(0);
	$('#curPage').val(0);
}
//alert(type);
document.form1.submit();	
};


function page(type){
	if(type==1)
		$('#curPage').val(parseInt($('#curPage').val())-1);
	else if(type==2)  
		$('#curPage').val(parseInt($('#curPage').val())+1);
	else if(type==3)  
		$('#curPage').val(parseInt($('#curPage').val())-50);
	else if(type==4)  
		$('#curPage').val(parseInt($('#curPage').val())+50);
	
	document.form1.submit();	
	};

</script>


</body>

</html>